<template>
 <view class="container ">   
 <view class="flex   flex-wrap diygw-col-24  flex-direction-column  justify-center  flex4-clz">  
  <view class="   diygw-col-0  text4-clz ">
    {{projectDetail.data.data.projectList.projectName}} 
  </view> 
 </view>   
 <view class="flex    diygw-col-24  justify-around  flex-nowrap  flex7-clz" @tap="navigateTo" data-type="page" data-url="/pages/xiangmuxiangqing">  
  <view class="flex diygw-col-0  justify-center"> 
   <view v-for="(item,index) in projectDetail.data.data.projectList.picture" :key="index" class="diygw-avatar  xs    radius   bg-none"> 
    <image mode="aspectFit" class="diygw-avatar-img radius" :src="projectDetail.data.data.projectList.picture"></image> 
   </view> 
  </view>   
  <view class="flex    diygw-col-24  flex-direction-column  justify-start  flex-wrap  flex-clz">   
   <view class="flex   flex-wrap diygw-col-0  flex3-clz">  
    <view class="   diygw-col-0  text1-clz ">
      {{projectDetail.data.data.projectList.projectName}} 
    </view>  
    <view class="   diygw-col-0 ">
      {{projectDetail.data.data.projectList.projectType}} 
    </view> 
   </view>   
   <view v-for="(item,index) in projectDetail.data.data.projectList.projectNeedList" :key="index" class="flex   flex-wrap diygw-col-0  flex-direction-column  flex1-clz">   
    <view class="flex   flex-wrap diygw-col-0  flex5-clz">  
     <view class="   diygw-col-0  text5-clz ">
       {{item.needType}} 
     </view>  
     <view class="   diygw-col-0 ">
       {{item.typeValue}} 
     </view> 
    </view>   
    <view class="flex   flex-wrap diygw-col-0  flex8-clz">  
     <view class="   diygw-col-0  text9-clz ">
       {{item.needDetail}} 
     </view>  
     <view class="   diygw-col-0 ">
       {{item.detailValue}} 
     </view> 
    </view> 
   </view> 
  </view>   
  <view class="flex    diygw-col-0  justify-end  items-end  flex-nowrap  flex10-clz">  
   <view class="flex diygw-col-0  justify-end  avatar3-clz"> 
    <view class="diygw-avatar  xs    radius   "> 
     <text class="diy-icon-commentfill"></text> 
    </view> 
   </view>  
   <view class="   diygw-col-0  text13-clz ">
     256 
   </view> 
  </view> 
 </view>   
 <view class="flex   flex-wrap diygw-col-24  flex-direction-column  flex2-clz">  
  <view class="   diygw-col-24  text2-clz ">
    2020-03-19 8:19 
  </view>   
  <view class="flex   flex-wrap diygw-col-24  justify-start  flex6-clz">  
   <view class="flex diygw-col-0"> 
    <view class="diygw-avatar      radius   bg-none"> 
     <image mode="aspectFit" class="diygw-avatar-img radius" src="/static/grid1.png"></image> 
    </view> 
   </view>  
   <view class="   diygw-col-0  text6-clz ">
     你好，希望有机会和你沟通一下，小罐绿茶项目 
   </view> 
  </view>   
  <view class="flex   flex-wrap diygw-col-24  justify-end  flex11-clz">  
   <view class="   diygw-col-0  text10-clz ">
     你好，小罐绿茶项目 
   </view>  
   <view class="flex diygw-col-0"> 
    <view class="diygw-avatar      radius   bg-none"> 
     <image mode="aspectFit" class="diygw-avatar-img radius" src="/static/grid1.png"></image> 
    </view> 
   </view> 
  </view> 
 </view>   
 <view class="clearfix"></view> 
</view>
</template>

<script>
 //create by: 邓志锋 <280160522@qq.com> <https://www.diygw.com> DIYGW可视化设计一键生成源码
 export default {
  data() {
   return {
    //用户全局信息
    userInfo:{},
    projectDetail:{
    "code": "200",
    "data": {
        "data": {
            "projectList": {
                "projectStatus": "优选发布",
                "projectPaper": "",
                "userPhone": "123",
                "projectCommentList": [
                    {
                        "id": "434443085955465217",
                        "userName": "用户1",
                        "projectName": "作业帮",
                        "userId": "434443664980705281",
                        "projectId": "434440356570595329",
                        "content": "太棒啦太棒啦"
                    }
                ],
                "projectType": "教育业",
                "projectDesc": "好项目",
                "id": "434440356570595329",
                "projectName": "作业帮",
                "userName": "用户1",
                "userId": "434443664980705281",
                "picture": "image1",
                "projectNeedList": [
                    {
                        "needDetail": "椅子",
                        "id_": "434440356570595329",
                        "detailValue": "500",
                        "needType": "人才",
                        "typeValue": "5%股份",
                        "projectId": "434440356570595329"
                    }
                ]
            }
        },
        "initData": {
            "projectList": {
                "projectList": {
                    "projectStatus": "",
                    "projectPaper": "",
                    "userPhone": "",
                    "projectType": "",
                    "projectDesc": "",
                    "projectName": "",
                    "userName": "",
                    "userId": "",
                    "picture": ""
                },
                "projectComment": {
                    "commentDate": "",
                    "userName": "",
                    "projectName": "",
                    "userId": "",
                    "projectId": "",
                    "content": ""
                },
                "projectNeed": {
                    "needDetail": "",
                    "detailValue": "",
                    "needType": "",
                    "typeValue": "",
                    "projectId": ""
                }
            }
        },
        "permission": {
            "projectList": {
                "projectList": {
                    "projectStatus": "w",
                    "projectPaper": "w",
                    "userPhone": "w",
                    "projectType": "w",
                    "projectDesc": "w",
                    "projectName": "w",
                    "userName": "w",
                    "userId": "w",
                    "picture": "w"
                },
                "projectComment": {
                    "commentDate": "w",
                    "userName": "w",
                    "projectName": "w",
                    "userId": "w",
                    "projectId": "w",
                    "content": "w"
                },
                "projectNeed": {
                    "needDetail": "w",
                    "detailValue": "w",
                    "needType": "w",
                    "typeValue": "w",
                    "projectId": "w"
                }
            }
        },
        "tablePermission": {
            "projectList": {
                "projectList": "w",
                "projectComment": "w",
                "projectNeed": "w"
            }
        }
    },
    "isOk": true
},
   }
  },
  onShow(){
   this.setCurrentPage(this)
   
  },
  onLoad(option) {
   this.setCurrentPage(this)
   if (option) {
    this.setData({
     globalOption: this.getOption(option)
    })
   }
   
   this.init();
  },
  methods:{
   async init(){
    await this.projectDetailApi()
   },
   // 项目详情接口 API请求方法
   async projectDetailApi(){
    let projectDetail = await this.$http.post('https://agent.diygw.com/',{
     url:'/form/formDefData/getData',
     method:'post',
     headers: {
      'Content-Type':'application/x-www-form-urlencoded',
     },
     'id':        this.globalOption.id||'434440356570595329'
,
     'key':        'projectList'

    },{
     'Content-type': 'application/json',
    },'json');
    this.projectDetail = projectDetail
   },
  }
 }
</script>

<style  lang="scss" scoped>
 .flex4-clz{margin-left:5px;padding-top:0px;padding-left:0px;width:calc(100.0% - 5px - 5px) !important;font-size:15px;padding-bottom:0px;margin-top:10px;margin-bottom:10px;border-bottom:1px solid #eee ;margin-right:5px;padding-right:0px}.text4-clz{font-weight:bold;text-align:center}.flex7-clz{border:1px solid #eee ;padding-top:0px;border-bottom-left-radius:6px;padding-left:0px;padding-bottom:0px;border-top-right-radius:6px;margin-right:5px;margin-left:5px;box-shadow:0px 1px 3px  rgba(31, 31, 31, 0.16);overflow:hidden;width:calc(100.0% - 5px - 5px) !important;border-top-left-radius:6px;margin-top:5px;border-bottom-right-radius:6px;margin-bottom:5px;padding-right:0px}.flex-clz{margin-left:15px;width:calc(100.0% - 15px - 5px) !important;margin-top:5px;margin-bottom:5px;margin-right:5px}.text1-clz{font-weight:bold}.text5-clz{font-weight:bold}.text9-clz{font-weight:bold}.avatar3-clz{margin-left:5px;background-size:100% 100%;margin-top:15px;margin-bottom:5px;margin-right:0px}.text13-clz{margin-left:5px;margin-top:5px;margin-bottom:10px;margin-right:5px}.flex2-clz{margin-left:5px;width:calc(100.0% - 5px - 5px) !important;margin-top:20px;margin-bottom:5px;margin-right:5px}.text2-clz{margin-left:5px;padding-top:0px;padding-left:0px;width:calc(100.0% - 5px - 5px) !important;padding-bottom:0px;margin-top:5px;margin-bottom:5px;text-align:center;margin-right:5px;padding-right:0px}.flex6-clz{margin-left:10px;padding-top:0px;padding-left:0px;width:calc(100.0% - 10px - 15px) !important;padding-bottom:0px;margin-top:15px;margin-bottom:15px;margin-right:15px;padding-right:0px}.text6-clz{margin-left:15px;border:1px solid #eee ;padding-top:0px;box-shadow:0px 2px 3px  rgba(31, 31, 31, 0.16);overflow:hidden;padding-left:0px;padding-bottom:0px;margin-top:20px;margin-bottom:5px;margin-right:20px;padding-right:0px}.flex11-clz{margin-left:10px;padding-top:0px;padding-left:0px;width:calc(100.0% - 10px - 15px) !important;padding-bottom:0px;margin-top:15px;margin-bottom:15px;margin-right:15px;padding-right:0px}.text10-clz{margin-left:20px;border:1px solid #eee ;padding-top:0px;box-shadow:0px 2px 3px  rgba(31, 31, 31, 0.16);overflow:hidden;padding-left:0px;padding-bottom:0px;margin-top:20px;margin-bottom:5px;margin-right:15px;padding-right:0px}.container{
      padding-left: 0px;
      padding-right: 0px;
      
      
      
      
      
      font-size:12px;
      
  }.container{


  }
</style>


